import React from 'react'
import styled from 'styled-components'
const MyLoading=styled.div`
    width: 0px;
    height: 0px;
    border-left: 25px solid rgb(236, 87, 67);
    border-top: 25px solid rgb(236, 87, 67);
    border-bottom: 25px solid transparent;
    border-right: 25px solid transparent;
    border-radius: 50%;
    position: relative;
    animation: rotate 1s linear infinite;
    & .box{
        position: absolute;
        width: 40px;
        height: 40px;
        left: -20px;
        top: -20px;
        border-radius: 50%;
        background: white;
    }
    @keyframes rotate { to {  transform: rotate(1turn) }}
        
`

function Loading() {
    return (
        <MyLoading>
            <div className='box'></div>
        </MyLoading>
    )
}

export default Loading
